<template>
  <div>
    <div class="card-text">
      <h1>Plenary Speakers</h1>
    </div>
    <div style="text-align: center;">
      <SpeakerInfoCard 
        v-for="(i,index) in datas"
        :key="index"
        :hname    = "i.hname"
        :synopsis = "i.synopsis"
        :imgUrl   = "i.imgUrl"
        :title    = "i.title"
        :abstract = "i.abstract"
      />
    </div>
</div>

</template>

<script>
import SpeakerInfoCard from "../components/PlenarySpeakers/SpeakerInfoCard.vue" 
// import TalkTable_01 from "../components/Programme/TalkTable_01.vue" 
// import Download from "../components/Programme/Download.vue" 

export default {
  components: { SpeakerInfoCard },
  data() {
    return {
      datas: []
    };
  },
  created() {
    this.$http.get('/json/PlenarySpeakers.json').then((response) => {
      // console.log(response);
      this.datas = response.data.datas;
    });

  }



}
</script>

<style lang="less" scoped>
@import "../components/typora_like.less";

</style>
